<template>
	<div>
		<el-select
			ref="ssup"
		    size="mini"
		    v-model="supplier"
		    filterable
		    remote
		    reserve-keyword
		    :placeholder="holder"
		    :remote-method="remoteMethod"
		    :loading="loading">
		    <el-option
		      v-for="item in options"
		      :key="item.id"
		      :label="item.subname"
		      :value="item.subname">
		    </el-option>
		  </el-select>
	</div>
</template>

<script>
	export default {
		data(){
			return {
				 supplier:"",
				 loading:false,
				 options:[]
			}
		},
		props:{
			supp:{
				type:String,
				default:''
			},
			holder:{
				type:String,
				default:'请输入供应商名称'
			},
			isdisabled:{
				type:Boolean,
				default:false
			}
		},
		watch:{
			supplier(newVal){
				this.$emit('getSupplierName',this.supplier)
			},
			supp(newVal){
				this.supplier = newVal
			},
		},
		mounted() {
			
		},
		methods:{
			remoteMethod(keywords) {
				if (keywords !== '') {
					 this.loading = true;
				  this.$post('/user/searchUser',{keywords},res=>{
					  let result = res.data.data
					  for(let item of result){
						  item.subname = item.name + '_' + item.phone
					  }
					   this.loading = false
					  if(result.length==1){
						  this.supplier = result[0].subname
						  this.$refs.ssup.blur()
					  }
					  this.options = res.data.data
				  })
				} else {
				  this.options = [];
				}
		  }
		}
	}
</script>

